import Router from 'next/router';

import Head from 'next/head';
import Image from 'next/image';

import logo from '../public/common/logo.png';
import logo_white from '../public/common/logo_white.png';

// import '../asserts/styles.less';
const go2 = (type: string) => {
  switch (type) {
    case 'index':
      Router.push('/')
      break
    case 'download':
      Router.push('/download')
      break
    case 'register':
      Router.push('/register')
      break
  }
}

export default (props: any) => (
  <>
    <Head>
      <meta name='viewport' content='width=device-width, initial-scale=0, maximum-scale=0, user-scalable=yes,shrink-to-fit=no' />
      <meta charSet='utf-8' />
      <meta name="keywords" content="研发管理,软件团队,知识库,沟通,任务管理,缺陷管理,研发评估" />
      <meta name="description" content="作为软件研发团队的信息枢纽，凌鲨连接了研发过程中所需的工具和信息，从而实现研发过程中的高效沟通，知识沉淀，合理评估。目前我们开放除了服务端外的所有源代码，所有人可以在符合开源协议的情况下对软件进行修改。服务端程序我们会开放给云服务厂商，让在意数据隐私的客户部署在自己的云上。" />
      <title>软件研发助手 -- 研发效能一站式解决方案</title>
      <link rel='shortcut icon' href='/favicon.ico' type='image/ico' />
    </Head>
    <style jsx global>{`
      html,body {
        min-width: 1280px;
      }
      .main-header {

      }

      .header-wrap {
        position: relative;
        padding: 28px 0;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        max-width: 1570px;
        z-index: 100;
      }

      .logo {
        margin-left: 15px;
      }

      .header-l {
        display: flex;
        align-items: center;
      }

      .header-l h2 {
        margin-bottom: 0;
      }

      .header-r {
        display: flex;
      }

      .ht-btn {
        margin-left: 32px;
        width: 140px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 18px;
        font-weight: 700;
        border: 2px solid #0078F7;
      }
      .ht-btn:hover {
        color:
      }
      .openSource {
        color: #242630;
        border: none;
      }
      .download {
        color: #fff;
        background: #0078F7;
      }

      .content-container {
      }

      .main-footer {
        width: 100%;
        height: 140px;
        background-color: #2B3141;
      }

      .footer-wrap {
        padding: 0 175px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 100%;
      }
      .footer-logo {
        display: flex;
        align-items: center;
        font-size: 26px;
        font-family: Hiragino Sans GB;
        color: #FFFFFF;
        line-height: 22px;
      }
      .footer-cc {
        font-size: 14px;
        font-family: PingFang SC;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 22px;
        opacity: 0.3
      }
      .footer-link {

      }
      .download-btn {

      }
    `}</style>

    <header className='main-header'>
      <div className='header-wrap'>
        <a href='/'>
          <div className='header-l' onClick={() => go2('index')}>
            <Image src={logo} width={64} height={64} />
            <h2 className='logo'>凌鲨</h2>
          </div>
        </a>

        <div className='header-r'>
          <a className='ht-btn openSource' href="https://openlinksaas.atomgit.net/docs/#/" target="_blank">文档</a>
          <a className='ht-btn openSource' href="https://atomgit.com/openlinksaas/desktop" target="_blank">源代码</a>
          <a className='ht-btn download' onClick={() => go2('download')}>下载</a>
        </div>
      </div>
    </header>

    <div className='content-container'>
      {props.children}
    </div>

    <footer className='main-footer'>
      <div className='footer-wrap'>
        <div className='footer-logo' onClick={() => go2('index')}>
          <Image src={logo_white} width={64} height={64} />
          <span className='logo'>凌鲨</span>
        </div>

        <div className='footer-cc'>
          <p><a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2020036654号-17</a> 2025</p>
        </div>

      </div>
    </footer>
  </>
)
